<template>
  <div>
    <div class="header">
    </div>
    <div class="menu">
      <div class="menu-container">
        <admin-menu></admin-menu>
      </div>
      <div class="content">
        <my-article v-show="show" :project="projectList" :type="typeList" @onsubmit="onsubmit" :form="form"></my-article>
      </div>
    </div>
  </div>
</template>

<script>
import adminMenu from '../../components/admin/menu'
import myArticle from '../../components/admin/article'
import mixinsList from '../../mixins/index.js'

export default {
  mixins: [mixinsList],
  data () {
    return {
      form: {},
      show: false
    }
  },
  components: {
    adminMenu,
    myArticle
  },
  mounted () {
    this.getType()
    this.getProject()
    if (this.$route.query.id) {
      this.getNews(this.$route.query.id)
    } else {
      this.show = true
    }
  },
  methods: {
    onsubmit (obj) {
      obj.type = obj.type.join(',')
      this.$store.dispatch('addNews', {
        data: obj,
        cb: (res) => {
          if (res.data.code === 20000) {
            this.$message.success('请求成功')
            this.$router.push({path: '/admin/news'})
          }
        }
      })
    },
    getNews (id) {
      this.$store.dispatch('getNews', {
        data: {
          id: id
        },
        cb: (res) => {
          if (res.data.code === 20000) {
            this.form = res.data.data
            this.show = true
          }
        }
      })
    }
  }
}
</script>

<style lang="stylus" scoped>
  .header
    background-color #4d535b
    height 40px
    width 100%
  .menu
    display flex
    .menu-container
      flex-basis 200px
    .content
      flex-grow 2
      background-color #fff
      padding 40px
</style>
